<template>
	<view>
		<!-- #ifdef MP -->
		<view style="height: 44px;" class="fixed-top flex align-center bg-white">
			<view class="flex-1 px-3">
				<view class="bg-light flex align-center rounded-circle px-3 py-1">
					<text class="font text-light-muted">精彩热评：帝莎编程学院</text>
				</view>
			</view>
		</view>
		<view style="height: 44px;"></view>
		<!-- #endif -->
		<card title="热门分类" :show-refresh="false">
			<scroll-view scroll-x class="scroll-row">
				<icon-cate v-for="(item,index) in hotCates"
				:key="index" :item="item" :index="index"></icon-cate>
			</scroll-view>
		</card>
		<view class="f-divider"></view>
		<card title="全部分类" :show-refresh="false">
			<view class="flex flex-wrap">
				<icon-cate v-for="(item,index) in cates"
				:key="index" :item="item" :index="index"></icon-cate>
			</view>
		</card>
	</view>
</template>

<script>
	import iconCate from '@/components/common/icon-cate.vue';
	import $data from '@/common/test/data.js';
	
	export default {
		components: {
			iconCate
		},
		data() {
			return {
				hotCates:[],
				cates:[],
			}
		},
		onLoad() {
			this.getData()
		},
		onNavigationBarButtonTap() {
			uni.switchTab({
				url:'../category/category'
			})
		},
		onPullDownRefresh() {
			this.getData().then(res=>{
				uni.showToast({
					title: '刷新成功',
					icon: 'none'
				});
				uni.stopPullDownRefresh()
			}).catch(err=>{
				uni.stopPullDownRefresh()
			})
		},
		methods: {
			getData(){
				return this.$H.get('/category').then(res=>{
					this.cates=res
					this.hotCates=res
				})
			},
		}
	}
</script>

<style>

</style>
